<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
<html>
<head>
	<%@include file="includes/common/headCommonHtml.jsp" %>
	<title>LL-Sign up!</title>
	<script>
		function validateFields () {
			var isOk = true, mark = [];
			$(".terms,.email,.password").removeClass('field-error');
			if (!$('.terms').is (':checked')) {
				$(".terms").addClass('field-error');
				isOk = false;
			} // if
			if (!/\w+@\w+/.test ($('.email').val())) {
				$(".email").addClass('field-error');
				isOk = false;
			} // if 
			if ($('.password1').val() != $('.password2').val()) {
				$(".password").addClass('field-error');
				isOk = false;
			} 
			if ($('.password1').val() == "") {
				$(".password").addClass('field-error');
				isOk = false;
			} // if 
			if (isOk) {
				$('.signup').removeAttr ('disabled');
			} else {
				$('.signup').attr ('disabled', 'disabled');
			} // if
		} // validateFields
		$(document).ready (function () {
			validateFields ();
			$('.email, .password').keyup (function () {
				validateFields();
			});
			$('.terms').change(function () {
				validateFields();
			});
			$('.terms').click(function () {
				validateFields();
			});
		});
	</script>
	<script src="<c:url value='/resources/epilog.js'/>"></script>
</head>
<body>
<%@include file="includes/common/prologHtml.jsp" %>
<div class="left-nav">Left Navigation</div>
<div class="main-contents">
<div class="server-message"></div>

Sign up to use the advanced features of LL!
<p>
<form:form method="post" action="/learnlang/registerActionPost" modelAttribute="registerActionInfo">   
<table class="login-form-table">
<tr><td>Email:</td><td><form:input class="email" path="email"/></td></tr>
<tr><td>Password:</td><td><form:input class="password1 password" type="password" path="password"/></td></tr>
<tr><td>Password (repeat):</td><td><form:input class="password2 password" type="password" path="password2"/></td></tr>
<tr><td colspan=2>&nbsp;</td></tr>
<tr><td colspan="2">
	<form:checkbox class="terms" path="termsAgreed" value="IAgree"/>
	I agree to the LL! <a href="<c:url value='/otherPages/privacyPolicyPage'/>">Privacy Policy</a> 
	and <a href="<c:url value='/otherPages/termsOfServicePage'/>">Terms of Service</a> 
	</td></tr>
</table>
<p>
<input type="submit" class="signup" value="Sign up!"/> 
</form:form>
<%@include file="includes/common/epilogHtml.jsp" %>

</body>
</html>
